<div class="row">
  <a id="save-btn" href="javascript:void(0)" class="btn btn-primary">保存</a>
  <a id="cancel-btn" href="javascript:void(0)" class="btn btn-danger">取消</a>
  <a id="clear-btn" href="javascript:void(0)" class="btn btn-warning">清空</a>
  <a id="add-btn" href="javascript:void(0)" class="btn btn-primary">新增</a>
</div>
<div class="row">
  <table class="table">
    <thead>
      <tr>
        <th>行情类别</th>
        <th>服务器IP</th>
        <th>服务器端口</th>
        <th>说明</th>
      </tr>
    </thead>
    <tbody id="list-tbody">
    </tbody>
  </table>
</div>
<script type="text/javascript">
var rowCount = 0;

$(document).ready(function()
{
	getData();
	
	$('#save-btn').on('click', function() 
	{
		saveData();
 	});
	
	$('#add-btn').on('click', function() 
	{
		$('#list-tbody').append('<tr>');
		$('#list-tbody').append('<td><input id=\"in_type' + rowCount + '\" type=\"text\" class=\"form-control\"></td>');
		$('#list-tbody').append('<td><input id=\"in_ip' + rowCount + '\" type=\"text\" class=\"form-control\"></td>');
		$('#list-tbody').append('<td><input id=\"in_port' + rowCount + '\" type=\"text\" class=\"form-control\"></td>');
		$('#list-tbody').append('<td><input id=\"in_desc' + rowCount + '\" type=\"text\" class=\"form-control\"></td>');
		$('#list-tbody').append('</tr>');
		
		rowCount++;
 	});
	
	$('#clear-btn').on('click', function() 
	{
		rowCount= 0;
		$('#list-tbody').empty();
 	});
	
	$('#cancel-btn').on('click', function() 
	{
		getData();
 	});
});

function getData()
{
	send('/a', 'event=g', function callbackComplete(jqXHR, textStatus)
	{}, 
	function callbackError(jqXHR, textStatus, errorThrown)
	{
		$('#message-body').text(errorThrown);
		$('#message-dialog').modal('show');
	}, 
	function callbackSuccess(data, textStatus, jqXHR)
	{
		var info = JSON.parse(data);
		
		if(info.code == '00000')
		{
			rowCount = info.host.length;
			
			$('#list-tbody').empty();
			
			for(i = 0 ; i < rowCount ; i++)
			{
				$('#list-tbody').append('<tr>');
				$('#list-tbody').append('<td><input id=\"in_type' + i + '\" type=\"text\" value=\"' + info.host[i].type + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('<td><input id=\"in_ip' + i + '\" type=\"text\" value=\"' + info.host[i].ip + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('<td><input id=\"in_port' + i + '\" type=\"text\" value=\"' + info.host[i].port + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('<td><input id=\"in_desc' + i + '\" type=\"text\" value=\"' + info.host[i].desc + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('</tr>');
			}
		}
		else
		{
			$('#message-body').text(info.message);
			$('#message-dialog').modal('show');
		}
	});
}

function saveData()
{
	var src = '';
	var in_type = '';
	var in_ip = '';
	var in_port = '';
	
	if(rowCount > 0)
	{
		src = '[';
		
		for(i = 0 ; i < rowCount ; i++)
		{
			in_type = $('#in_type' + i).val();
			in_ip = $('#in_ip' + i).val();
			in_port = $('#in_port' + i).val();
			
			if(in_type.length > 0 && in_ip.length > 0 && in_port.length > 0)
			{
				src += '{';
				src += '\"type\":\"' + in_type + '\",';
				src += '\"ip\":\"' + in_ip + '\",';
				src += '\"port\":\"' + in_port + '\",';
				src += '\"desc\":\"' + $('#in_desc' + i).val() + '\"';
				src += '},';
			}
		}
		
		src = src.substring(0, src.length - 1);
		src += ']';
	}
	
	send('/a', 'event=s&src=' + src, function callbackComplete(jqXHR, textStatus)
	{}, 
	function callbackError(jqXHR, textStatus, errorThrown)
	{
		$('#message-body').text(errorThrown);
		$('#message-dialog').modal('show');
	}, 
	function callbackSuccess(data, textStatus, jqXHR)
	{
		console.log(data);
		var info = JSON.parse(data);
		
		if(info.code == '00000')
		{
			$('#message-body').text('保存完成');
			$('#message-dialog').modal('show');
			
			rowCount = info.host.length;
			
			$('#list-tbody').empty();
			
			for(i = 0 ; i < rowCount ; i++)
			{
				$('#list-tbody').append('<tr>');
				$('#list-tbody').append('<td><input id=\"in_type' + i + '\" type=\"text\" value=\"' + info.host[i].type + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('<td><input id=\"in_ip' + i + '\" type=\"text\" value=\"' + info.host[i].ip + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('<td><input id=\"in_port' + i + '\" type=\"text\" value=\"' + info.host[i].port + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('<td><input id=\"in_desc' + i + '\" type=\"text\" value=\"' + info.host[i].desc + '\" class=\"form-control\"></td>');
				$('#list-tbody').append('</tr>');
			}
		}
		else
		{
			$('#message-body').text(info.message);
			$('#message-dialog').modal('show');
		}
	});
}
</script>